<!-- <section class="content container-fluid"> -->
<div class="card-header">
    <filter-list request="request" callback="getList(pageIndex)"></filter-list>
</div>
<div class="card-body">
    <table class="table table-sm table-hover" cellspacing="0">
        <thead class="thead-light">
            <tr>
                <th scope="col" style="width: 3%;">
                    <span class="oi oi-sort-ascending"></span>
                </th>
                <!--<th scope="col" style="width: 4%;">
                                        <span class="fas fa-sort-numeric-down"></span>
                                    </th>-->
                <th scope="col" width="30%">
                    Title
                </th>
                <th scope="col" width="10%">
                    Created Date
                </th>
                <th scope="col" style="width: 10%;">
                    Created By
                </th>
                <th scope="col" width="5%">
                    Image
                </th>

                <th scope="col" class="text-right" width="5%">Actions</th>
            </tr>
        </thead>

        <tbody class="sortable" ng-init="getList()">
            <tr ng-repeat="item in data.items track by $index" class="sortable-item" sort-model="product" sort-model-id="{{item.id}}">
                <td style="cursor:move;" class="drag-header">
                    <!--<span class="fas fa-sort"></span>-->

                    <div class="btn-group btn-group-sm" role="group" aria-label="Basic example">
                        <button type="button" class="btn btn-light"><span class="fa fa-sort-up small"></span></button>
                        <button type="button" class="btn btn-light"><span class="fa fa-sort-down small"></span></button>
                    </div>
                </td>
                <!--<td>
                                        <input type="text" value="{{item.priority}}" class="item-priority form-control form-control-sm d-inline" style="width:40px;" />
                                    </td>-->
                <td>
                    {{item.title}}
                </td>
                <td>
                    <small>
                        {{item.createdDateTime | utcToLocal:'d.M.yyyy h:mm a'}}
                    </small>
                </td>
                <td>
                    {{item.createdBy}}
                </td>
                <td>
                    <preview-image img-height="25" img-src="item.imageUrl"></preview-image>
                </td>

                <td>
                    <div class="btn-group btn-group-sm btn-group-sm float-right" role="group" aria-label="Actions">
                        <a href="/portal/product/details/{{item.id}}" class="btn btn-light">
                            <span class="fa fa-pen text-primary"></span>
                        </a>
                        <a ng-click="preview(item)" target="_blank" class="btn btn-light">
                            <span class="fa fa-eye text-primary"></span>
                        </a>
                        <a ng-click="remove(item.id);" class="btn btn-light">
                            <span class="fas fa-times text-danger"></span>
                        </a>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="card-footer">
    <paging class="small" page="data.page" page-size="data.pageSize" total="data.totalItems" ul-class="pagination justify-content-end"
        a-class="page-link" paging-action="getList(page-1)" scroll-top="true">
</div>




<!-- </section> -->
